import { computed, reactive } from 'vue';
import * as Vue from 'vue'
import { digitUppercase } from '../utils';

let LowcodeComponentProps;
if (import.meta.env.DEV) {
    LowcodeComponentProps = reactive({})
} else {
    LowcodeComponentProps = Vue.LowcodeComponentProps
}
export function useMoney() {
    // 金额转中文大写
    const chineseMoney = computed(() => {
        if (!LowcodeComponentProps.value && LowcodeComponentProps.value != 0) return ''
        return digitUppercase(LowcodeComponentProps.value)
    })

    // 金额千分位
    const formatMoney = computed(() => {
        if (!LowcodeComponentProps.value && LowcodeComponentProps.value != 0) return ''
        return Number(LowcodeComponentProps.value).toLocaleString()
    })

    const inputHandler = e => {
        // 去掉千分位
        const value = e.target.value.replace(/,/g, '')
        // 校验非法输入
        if (Number.isNaN(Number(value))) {
            e.target.value = formatMoney
            return
        }
        LowcodeComponentProps.value = Number(value)
    }

    return [chineseMoney, formatMoney, inputHandler]
}